<template>
  <el-table
    :data="tableData"
    style="width: 100%"
    :header-row-class-name="
      ({ row, rowIndex }) => {
        if (rowIndex === 0) return 'table-header-bg'
      }
    "
  >
    <el-table-column type="index" label="序号"></el-table-column>
    <el-table-column prop="customerName" label="姓名" width="100"> </el-table-column>
    <el-table-column prop="customerAddress" label="地址">
      <template v-slot="scope">
        <span>{{ scope.row.customerAddress + '-' + scope.row.customerAddressInfo }}</span>
      </template>
    </el-table-column>
    <el-table-column prop="customerPhone" label="客户电话" width="150"> </el-table-column>
    <el-table-column prop="customerCreateTime" label="创建时间" width="100">
      <template v-slot="slotProps">
        <!-- {{ new Date(slotProps.row.customerCreateTime).toLocaleDateString() }} -->
        {{ getUserFormatDate(slotProps.row.customerCreateTime) }}
      </template>
    </el-table-column>
    <el-table-column prop="customerState" label="客户状态" width="100">
      <template v-slot="slotProps">
        <span class="">{{ slotProps.row.customerState === 1 ? '正常' : '注销' }}</span>
      </template>
    </el-table-column>
    <el-table-column label="查看详细" width="180">
      <template v-slot="slotProps">
        <router-link :to="{ path: '/home/customedetail', query: { id: slotProps.row.customerId } }">
          <i class="text-20 curser-pointer text-primary mr-20 el-icon-s-comment"></i>
        </router-link>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
import { getUserFormatDate } from './../../utils/dateUtils.js'
export default {
  data() {
    return {}
  },
  props: {
    tableData: Array
  },

  methods: {
    getUserFormatDate
  }
}
</script>

<style></style>
